<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="../css/font.css">
<!--        <link rel="stylesheet" href="./css/layui.css">-->
        <link rel="stylesheet" href="../css/xadmin.css">
        <script src="../lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="../js/xadmin.js"></script>
        <script type="text/javascript" src="../js/jquery.min.js"></script>
        <!--[if lt IE 9]>
          <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
          <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">房间</a>
            <a>
              <cite>房间列表</cite></a>
          </span>
          <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body ">
                            <form class="layui-form layui-col-space5">
                                <div class="layui-inline layui-show-xs-block">
                                    <input class="layui-input"  autocomplete="off" placeholder="开始日" name="start" id="start">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <input class="layui-input"  autocomplete="off" placeholder="截止日" name="end" id="end">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <input type="text" id="roomName" name="roomName"  placeholder="房间名称" autocomplete="off" class="layui-input">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <button class="layui-btn"  lay-submit="" lay-filter="search"><i class="layui-icon">&#xe615;</i></button>
                                </div>
                            </form>
                        </div>
                        <div class="layui-btn-group demoTable">
                            <button class="layui-btn layui-btn-danger" data-type="delMore"><i class="layui-icon"></i>批量删除</button>
                            <button class="layui-btn" onclick="xadmin.open('添加房间','room-add.html',600,400)"><i class="layui-icon"></i>添加</button>
                        </div>
                        <div class="layui-card-body">
                            <table class="layui-table layui-form" id="layListId" lay-filter="layList">
                                <script type="text/html" id="barDemo">
                              <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                              <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                                </script>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
    </body>
    <script>
      layui.use(['laydate','form','table'], function(){
        var laydate = layui.laydate;
        var form = layui.form;
        var table=layui.table;
        var laypage=layui.laypage;
        //执行一个laydate实例
        laydate.render({
          elem: '#start' //指定元素
        });
        //执行一个laydate实例
        laydate.render({
          elem: '#end' //指定元素
        });
          table.render({
              elem: '#layListId',
              id: 'layTableId',
              url: '/room/list'+location.search,
              title: '房间列表',
              cellMinWidth: 90,
              cols: [
                  [{
                      type: 'checkbox',
                      fixed: 'left'
                  }, {
                      field: 'roomId',
                      title: '房间Id',
                      fixed: 'left'
                  }, {
                      field: 'roomName',
                      title: '房间名称',
                  }, {
                      field: 'roomType',
                      title: '房间类型',
                      templet: function (d) {
                          if (d.roomType === 0) return '标间';
                          if (d.roomType === 1) return '一室';
                          if (d.roomType === 2) return '二室';
                          if (d.roomType === 3) return '三室';
                      },
                      offset: 'auto'
                  }, {
                      field: 'roomDesc',
                      title: '房间描述',
                  }, {
                      field: 'roomAddress',
                      title: '房间位置',
                  }, {
                      field: 'roomHoldCount',
                      title: '房间容纳人数',
                  }, {
                      title: '操作',
                      align: 'center',
                      toolbar: '#barDemo',
                  }]],
              page: true,
              limits: [5,10,20],
              limit: 5
          });
          table.on('checkbox(layList)', function(obj){
              console.log(obj)
          });
          //监听工具条,删除，编辑
          table.on('tool(layList)', function(obj){
              var data = obj.data;
                if(obj.event === 'del'){
                  layer.confirm('确定删除么', function(index){
                    /*  layer.alert('删除行：<br>'+ JSON.stringify(data));*/
                      $.ajax({
                          url:'/room/delete',
                          method:'post',
                          data:{roomId:data.roomId},
                          dataType:'JSON',
                          success:function(res){
                              if(res.code==200){
                                  layer.alert("删除成功！", {
                                          icon: 6
                                      },
                                      function() {
                                          //关闭当前frame
                                          xadmin.close();
                                          // 可以对父窗口进行刷新
                                          xadmin.father_reload();
                                      });
                              }
                              else
                                  alert(res.msg);
                          },
                          error:function (data) {
                              alert("没有权限！");
                          } });
                  });
              } else if(obj.event === 'edit') {
/*
                    layer.alert('编辑行：<br>' + JSON.stringify(data));
*/
                    xadmin.open('编辑', '/room-edit.html#/id='+data.roomId, 500, 400);
      }
          });

          var $ = layui.$, active = {
              //批量删除
              delMore: function () { //获取选中数据
                  var checkStatus = table.checkStatus('layTableId')
                      , data = checkStatus.data;
                  // layer.alert(JSON.stringify(data));
                  if(checkStatus.data.length==0){
                      parent.layer.msg('请先选择要删除的数据行！', {icon: 2});
                      return ;
                  }
                  var ids = "";
                  for(var i=0;i<checkStatus.data.length;i++){
                      ids += checkStatus.data[i].roomId+",";
                  }
                  $.ajax({
                      url:'/room/deleteBatch',
                      method:'post',
                      data:{ids:ids},
                      dataType:'JSON',
                      success:function(res){
                          if(res.code==200){
                              layer.alert("删除", {
                                      icon: 6
                                  },
                                  function() {
                                      //关闭当前frame
                                      xadmin.close();
                                      // 可以对父窗口进行刷新
                                      xadmin.father_reload();
                                  });
                          }
                          else
                              alert(res.msg);
                      },
                      error:function (data) {
                          alert("没有权限！");
                      } });


              }
          };
          $('.demoTable .layui-btn').on('click', function(){
              var type = $(this).data('type');
              active[type] ? active[type].call(this) : '';
          });
      });


      var param=new Object();
      param=getUrlParam();
      //alert("<<<<"+typeof param["start"]);
      $('#start').attr('value',param["start"]);
      $('#end').attr('value',param["end"]);
      $('#roomName').attr('value',param["roomName"]);

      function getUrlParam() {
          var url = location.search; //获取url中"?"符后的字符串包括‘？’ ，window.location.href获取的是url完整的字符串
          var theParam = new Object();
          if (url.indexOf("?") != -1) { //确保‘？’不是最后一个字符串，即携带的参数不为空
              var str = url.substr(1); //substr是字符串的用法之一，抽取指定字符的数目，这里抽取？后的所有字符
              strs = str.split("&"); //将获取到的字符串从&分割，输出参数数组，即输出[参数1=xx,参数2=xx,参数3=xx,...]的数组形式
              for(var i = 0; i < strs.length; i ++) { //遍历参数数组
                  theParam[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]); //这里意思是抽取每个参数等号后面的值，unescape是解码的意思
              }
          }
          return theParam; //返回参数值
      }
    </script>
    <script>var _hmt = _hmt || []; (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();</script>
</html>